<template>
  <div>
    <el-breadcrumb separator-class="el-icon-arrow-right">
      <el-breadcrumb-item :to="{ path: '/notice-admin' }">公告管理</el-breadcrumb-item>
      <el-breadcrumb-item>公告详情</el-breadcrumb-item>
    </el-breadcrumb>
    <div class="notice">
      <p class=" text-center ft-blue ft30">{{ notice.noticeTitle }}</p>
      <p class="ft-grey9 text-center">{{ notice.releaseDate }}</p>
      <div class="col-md-12 ft16 mar-t30" v-html="notice.noticeContent">
      </div>
    </div>
  </div>
</template>

<script>
import axios from 'axios';
import {useRouter} from 'vue-router';
import {ref, onMounted} from 'vue';

export default {
  data() {
    return {
      notice: {}
    };
  },
  computed: {},
  methods: {
    searchDetail(noticeId) {
      axios.get("/repaircenter/repairNotice/detail", {
        params: {
          noticeId: noticeId
        }
      })
          .then((resp) => {
            console.log(resp.data);
            this.notice = resp.data.data
          })
          .catch(error => {
            console.error('查询公告失败:', error);
          });
    }
  },
  setup() {
    const router = useRouter();
    const navigateToRoute = (url) => {
      router.push(url); // 替换为你想跳转的路由路径
    };

    return {
      navigateToRoute,
    };
  },
  mounted() {
    const noticeId = this.$route.query.noticeId;
    console.log('Notice ID:', noticeId);
  },
  created() {
    const noticeId = this.$route.query.noticeId;
    this.searchDetail(noticeId);
  }
};
</script>

<style scoped>

.daohang > a {
  color: #0000004d;
}

.daohang > span {
  color: #0000004d;
}

button {
  margin-left: 73%;
  margin-bottom: 15px;
}
</style>